import React, { Component } from 'react'
import { 
  string, 
  node, 
  element, 
  elementType, 
  instanceOf,
  oneOf,
  oneOfType,
  number,
  arrayOf,
  shape,
  exact
} from 'prop-types'
import { Abc } from './Abc'

class Child extends Component {
  static defaultProps = {
    title: 'default props value'
  }

  static propTypes = {
    // title: instanceOf(Abc)
    // title: oneOf(['aaa', 'bbb'])
    // title: oneOfType([
    //   string, 
    //   number
    // ])
    // title: arrayOf(number)
    // title: shape({
    //   aaa: string,
    //   ddd: number.isRequired
    // }),

    // title: exact({
    //   abc: string,
    //   def: number.isRequired
    // }),

    title(props, propName, componentName) {
      if (props.title.abc !== 'aaa') {
        throw new Error('你传的abc的值不正确')
      }
    }
  }

  render() {
    return (
      <div>
        {/* {this.props.title} */}
        {this.props.children}
        {/* <this.props.title></this.props.title> */}
      </div>
    )
  }

  // mounted
  componentDidMount() {
    // console.log(this.props.title)
    // 单向数据流，props不能修改
    // this.props.title = 'child component'
  }
}

export default Child;